<template>
  <div class="item" data-type="checkbox" v-bind:class="[('w'+obj.property.selfWidth)]">
      <div class="hd" v-bind:class="[('i'+obj.property.titleWidth+'d6')]">
        <span class="tit">{{obj.property.title}}</span>
        <span class="required" v-show="obj.property.required">*</span>
        <span class="block muted">{{obj.property.intro}}</span>
        <v-handle v-bind:handle="obj.handle"></v-handle>
      </div>
      <div class="bd" v-bind:class="[('i'+(obj.property.titleWidth==6?6:6-obj.property.titleWidth)+'d6')]">
        <el-radio-group v-model="obj.value">
          <el-radio :label="option.label" v-bind:class="[('c'+obj.property.columnCount),'ckb']" v-for="option in obj.property.options" :key="option.label">{{option.label}}</el-radio>
          <div v-if="obj.property.otherOption.show">
            <el-radio v-model="obj.property.otherOption.selected">
              {{obj.property.otherOption.title}}
              <span class="required" v-show="obj.property.otherOption.required">*</span>
              <el-input v-model="obj.property.otherOption.value">
              </el-input>
            </el-radio>
          </div>
        </el-radio-group>
      </div>
    </div>
</template>

<script>
export default {
  props: ['obj']
}
</script>
